<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <title>{$shebei.device_name}</title>
  <script src="__CDN__/assets/js/ezuikit.js"></script>
</head>

<body>
  <div style="display:flex;flex-direction:column">
    <h2 style="text-align: center;">{$shebei.device_name}</h2>
    <div id="video-container" style="width:100%;height:100%"></div>
<!-- 	<div>
      <button onClick="play()">play</button>
      <button onClick="stop()">stop</button>
      <button onClick="getOSDTime()">getOSDTime</button>
      <button onClick="getOSDTime2()">getOSDTime2</button>
      <button onClick="capturePicture()">capturePicture</button>
      <button onClick="openSound()">openSound</button>
      <button onClick="closeSound()">closeSound</button>
      <button onClick="startSave()">startSave</button>
      <button onClick="stopSave()">stopSave</button>
      <button onClick="ezopenStartTalk()">开始对讲</button>
      <button onClick="ezopenStopTalk()">结束对讲</button>
      <button onClick="fullScreen()">全屏</button>
    </div> -->
  </div>
  <script>
	var themeData = {
      "header": {
        "color": "#1890ff",
        "activeColor": "#FFFFFF",
        "backgroundColor": "#000000",
        "btnList": [
          {
            "iconId": "deviceID",
            "part": "left",
            "defaultActive": 0,
            "memo": "顶部设备序列号",
            "isrender": 1
          },
          {
            "iconId": "deviceName",
            "part": "left",
            "defaultActive": 0,
            "memo": "顶部设备名称",
            "isrender": 1
          },
          {
            "iconId": "cloudRec",
            "part": "right",
            "defaultActive": 0,
            "memo": "云存储",
            "isrender": 0
          },
          {
            "iconId": "rec",
            "part": "right",
            "defaultActive": 0,
            "memo": "SD卡回放",
            "isrender": 0
          }
        ]
      },
      "footer": {
        "color": "#FFFFFF",
        "activeColor": "#1890FF",
        "backgroundColor": "#00000021",
        "btnList": [
          {
            "iconId": "play",
            "part": "left",
            "defaultActive": 1,
            "memo": "播放",
            "isrender": 1
          },
          {
            "iconId": "capturePicture",
            "part": "left",
            "defaultActive": 0,
            "memo": "截屏按钮",
            "isrender": 1
          },
          {
            "iconId": "sound",
            "part": "left",
            "defaultActive": 0,
            "memo": "声音按钮",
            "isrender": 1
          },
          {
            "iconId": "pantile",
            "part": "left",
            "defaultActive": 0,
            "memo": "云台控制按钮",
            "isrender": 1
          },
          {
            "iconId": "recordvideo",
            "part": "left",
            "defaultActive": 0,
            "memo": "录制按钮",
            "isrender": 1
          },
          {
            "iconId": "talk",
            "part": "left",
            "defaultActive": 0,
            "memo": "对讲按钮",
            "isrender": 1
          },
          {
            "iconId": "hd",
            "part": "right",
            "defaultActive": 0,
            "memo": "清晰度切换按钮",
            "isrender": 1
          },
          {
            "iconId": "webExpend",
            "part": "right",
            "defaultActive": 0,
            "memo": "网页全屏按钮",
            "isrender": 1
          },
          {
            "iconId": "expend",
            "part": "right",
            "defaultActive": 0,
            "memo": "全局全屏按钮",
            "isrender": 1
          }
        ]
      }
    };
	
    var playr = new EZUIKit.EZUIKitPlayer({
          id: 'video-container', // 视频容器ID
          accessToken: '{$accessToken}',
          url: 'ezopen://open.ys7.com/{$shebei.device_serial}/1.live',
          //template: 'voice', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版; theme-可配置主题；
          themeData: themeData,
		  //header:['capturePicture','save','zoom'],
		  //footer:['talk','pantile','broadcast','hd'],
		  plugin: ['talk'],                       // 加载插件，talk-对讲
          width: '1900',
          height: '600',
        });

    function fullScreen() {
      var playPromise = playr.fullScreen();
      playPromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function play() {
      var playPromise = playr.play();
      playPromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function stop() {
      var stopPromise = playr.stop();
      stopPromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function getOSDTime() {
      var getOSDTimePromise = playr.getOSDTime();
      getOSDTimePromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function getOSDTime2() {
      var getOSDTimePromise = playr2.getOSDTime();
      getOSDTimePromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function capturePicture() {
      var capturePicturePromise = playr.capturePicture();
      capturePicturePromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function openSound() {
      var openSoundPromise = playr.openSound();
      openSoundPromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function closeSound() {
      var closeSoundPromise = playr.closeSound();
      closeSoundPromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function startSave() {
      var startSavePromise = playr.startSave();
      startSavePromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function stopSave() {
      var stopSavePromise = playr.stopSave();
      stopSavePromise.then((data) => {
        console.log("promise 获取 数据", data)
      })
    }
    function ezopenStartTalk() {
      playr.startTalk();
    }
    function ezopenStopTalk() {
      playr.stopTalk();
    }
  </script>
</body>

</html>